<template>
	<view :class="['page',{'iphoneX':isIphoneX}]">  
		<view class="body"> 
			<template>
				<u--form :model="form" ref="uForm" class="form-wrap">
					<u-form-item label="货物名称" labelWidth="160" prop="p_name" borderBottom="true" class="u-form-item">
						<u-input v-model="detail.pname" placeholder="选择货物名称" disabled disabledColor="#ffffff" border="none" />
						<!-- <u-icon	slot="right" name="arrow-right"></u-icon> -->						
					</u-form-item>
					<u-form-item :label="detail.sname" labelWidth="160" prop="number" borderBottom="true" class="u-form-item">
						<u-input type="digit" v-model="detail.p_count" disabled disabledColor="#ffffff" placeholder="输入仓库库存" border="none" />
						<u--text :text="detail.uname" size="30" align="right"></u--text>	
					</u-form-item>  
					<view class="row-2">
						<u-form-item label="需求数量" labelWidth="160" prop="p_count" borderBottom="true" class="u-form-item"> 
							<u-input type="digit" v-model="form.p_count" class="text-inp" border="none" placeholder="输入需求数量"/>
							<u--text class="text-unit" :text="form.unit_name" size="30" align="right" ></u--text>
						</u-form-item>
						<u-button text="选择单位" type="success" size="small" class="btn m-l2" @click="units.isShow=true"></u-button>
					</view>
					<u-form-item label="项目名称" labelWidth="160" prop="p_name" borderBottom="true" class="u-form-item" @click="projectlist.isShow=true">
						<u-input v-model="form.projectname" placeholder="选择项目名称" disabled disabledColor="#ffffff" border="none" style="pointer-events: none;"/>
						<u-icon	slot="right" name="arrow-right"></u-icon>						
					</u-form-item>
					<u-form-item v-if="form.projectname=='其他'" label="其他项目" labelWidth="160" prop="p_count" borderBottom="true" class="u-form-item">
						<u-input type="text" v-model="form.otherprojectname" class="text-inp" border="none" placeholder="输入项目名称"/> 
					</u-form-item>
					<u-form-item label="审批人" labelWidth="160" prop="apply_user_name" borderBottom="true" class="u-form-item" @click="applyuser.isShow=true">
						<u-input type="text" v-model="form.apply_user_name" disabled disabledColor="#ffffff" placeholder="选择审批人" border="none" style="pointer-events: none;"/>
						<u-icon	slot="right" name="arrow-right"></u-icon>
					</u-form-item>  
				</u--form>			
			 
			</template>
			 
			<u-picker :show="units.isShow" :columns="units.data" keyName="uname" :defaultIndex="units.defaultIndex" itemHeight="90" :closeOnClickOverlay="true" @cancel="units.isShow=false" @confirm="changeunit" @close="units.isShow=false"></u-picker> 
			<u-picker :show="applyuser.isShow" :columns="applyuser.data" keyName="realname" itemHeight="90" :closeOnClickOverlay="true" @cancel="applyuser.isShow=false" @confirm="changeapplyuser" @close="applyuser.isShow=false"></u-picker>
			<u-picker :show="projectlist.isShow" :columns="projectlist.data" keyName="name" itemHeight="90" :closeOnClickOverlay="true" @cancel="projectlist.isShow=false" @confirm="changeprojectlist" @close="projectlist.isShow=false"></u-picker>  
			 
		</view>  
		<c-footer > 
			<view slot="content" class="add-btn" @click="add">提交</view> 
			
		</c-footer>
	</view>
</template>

<script>
	import {uploadToServe} from '@/common/util.js'
	import {IMG_PATH} from '../../config.js'
	export default {
		data() {
			return {
				id:'',
				pid:'', 
				isIphoneX:getApp().globalData.isIphoneX,  
				type:'', 
				page:'',  
				detail:{},
				form: { 
					apply_user_id:'',
					apply_user_name:'',
					unit_name:'',
					unit_id:'',
					projectname:'市场项目',
					otherprojectname:'',
					p_count:'',					 
				},   
				units:{					 
					isShow:false,
					data:[[]],
					defaultIndex:[]
				},
				applyuser:{
					isShow:false,
					data:[[]],
					defaultIndex:[]
				},
				projectlist:{
					isShow:false,
					data:[[
						{
							id:1,
							name:'市场项目'
						},
						{
							id:2,
							name:'政府项目'
						},
						{
							id:3,
							name:'其他'
						}
					]],
					defaultIndex:[]
				} 
			}
		},
		async onLoad(params) { 
			console.log(params)
			this.id=params.id;
			this.pid=params.pid;
			let title=''; 
			this.productsubscribewx();
			// this.productcategorylist();
			// this.productstorehouse();
			// this.productapplyuser();
			 
		},
		onShow() {
			
		}, 
		methods: {  
			
			async productsubscribewx(){
				let res=await this.$api.user_api.productsubscribewx({
					id:this.id,
					pid:this.pid
				});    
				console.log(res)
				if(res.data.code==200){  
					this.detail=res.data.data.data;
					this.$set(this.units.data,0,res.data.data.unitlist); 
					this.$set(this.applyuser.data,0,res.data.data.apply_user_list);
					this.form.apply_user_id=this.applyuser.data[0][0].uid;
					this.form.apply_user_name=this.applyuser.data[0][0].realname;
					this.form.unit_name=this.units.data[0][0].uname;
					this.form.unit_id=this.units.data[0][0].id;
					console.log(this.units.data)
				}
			},  
			
			changeprojectlist(e){
				this.form.projectname=e.value[0].name; 
				this.projectlist.isShow=false;
				this.projectlist.defaultIndex=e.indexs;
			},
			
			changeunit(e){
				this.form.unit_name=e.value[0].uname;
				this.form.unit_id=e.value[0].id; 
				this.units.isShow=false;
				this.units.defaultIndex=e.indexs;
			},
			
			changeapplyuser(e){
				this.form.apply_user_name=e.value[0].realname;
				this.form.apply_user_id=e.value[0].uid; 
				this.applyuser.isShow=false;
				this.applyuser.defaultIndex=e.indexs;
			},
			 
			async add(){
				let {apply_user_id,unit_id,unit_name,projectname,otherprojectname,p_count}=this.form; 
				 
				
				let params={
					product_id:this.pid,
					product_name:this.detail.pname,
					last_receive_user:this.detail.storehouseman,
					apply_user_id,
					p_count,
					projectname:projectname=='其他'?otherprojectname:projectname,
					user_unit:unit_id,
					uname:unit_name
				}
				if(p_count==''){
					this.$showToast({
						title:'请输入需求数量' 
					})
					return
				}				
				// if(this.detail.p_count==0||p_count>this.detail.p_count){
				// 	this.$showToast({
				// 		title:'库存不足' 
				// 	})
				// 	return
				// }
				
				let res=await this.$api.user_api.productsubscribesavewx(params);
				if(res.data.code==200){
					this.$showToast({
						icon:'success',
						title:res.data.msg,
						duration:1000,
					})
					// this.$store.commit('KUCUN_LIST_UPDATE',1);
					setTimeout(()=>{ 
						uni.navigateBack({
							delta:1
						})
					},300)						
				}
				
				 
			},
			 
			 
		},
		computed:{
			 
		},
		watch:{
			 
		}
	}
</script>

<style lang="less" >
	.hd-title{
		display: flex;
		justify-content: space-between;
		padding: 20rpx;
	}
	.upload-wrap{
		padding:20rpx;		
		background: #fff;
	}
	.u-form-item{
		.text-inp{
			width: 160rpx;
		}
		.text-unit{
			width: 180rpx;
		}
	}
	.form-wrap{
		padding:0 20rpx; 
		.row-2{
			display: flex;
			justify-content: space-between;
			align-items: center;
		}
	}
	.slot-content{
		.hd{
			padding: 30rpx 0 10rpx;
			font-size: 30rpx;
		}
	}
	.popup-form-wrap{
		padding:20rpx;
		border-radius: 15rpx;		 
	}
	.select-pz-wrap{
		display: flex;
		flex-wrap: wrap;
		.item{
			position: relative; 
			margin:0 20rpx 20rpx 0;
			.del-icon{
				position: absolute;
				right: -15rpx;
				top: -15rpx;
			}
		}
	}
	.add-btn{
		height: 36px;
		line-height: 36px;
		width: 96%;
		margin: 5px auto;
		background: #1cab1b;
		border-radius: 8rpx;
		color: #fff;
		font-size: 30rpx;
		text-align: center;
	}  
	.partslist-popup{ 
		position: relative;
		height: 100%;
		padding: 0 40rpx; 
		.hd{ 
			height: 40px;
		}
		.select-wrap{
			height: 80%;
			flex-grow: 2;
			margin: 20rpx 0;
			overflow-y: auto; 
			.item{
				margin-bottom: 20rpx;
			}
		}
		.btn-wrap{  
			margin: 20rpx 0;
			.btn{
				margin: 0 30rpx;
			}
		}
	}
</style>
